<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="basePath" value="${pageContext.request.contextPath}"/>
<!DOCTYPE HTML>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>提现申请列表</title>
    <jsp:include page="/resources/inc/head.jsp" flush="true"/>
</head>
<body>
<div id="main">
    <div id="collapseOne" class="panel-collapse collapse">
        <div class="panel panel-default" id="queryHead">
            <div class="panel-body">
                <form id="searchFrom" method="post" class="form-horizontal">
                    <label class="col-sm-2 search-control control-label" >状态：</label>
                    <div class="col-sm-2 search-control">
                        <select id="status" name="status" class="form-control">
                            <option value="-1">全部</option>
                            <option value="1">申请</option>
                            <option value="2">处理中</option>
                            <option value="3">已完成</option>
                            <option value="4">失败</option>
                            <option value="5">撤销</option>
                        </select>
                    </div>
                    <div class="col-sm-2 search-control ">
                        <button type="button" class="btn btn-primary" id="search_btn">查询</button>
                        <button type="reset" class="btn btn-primary" id="reset_btn">重置</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div id="toolbar">
        <shiro:hasPermission name="business:billlog:confirm"><a class="waves-effect waves-button" href="javascript:;" onclick="confirmAction()"><i class="glyphicon glyphicon-ok-sign"></i> 确认申请</a></shiro:hasPermission>
        <shiro:hasPermission name="business:billlog:submit"><a class="waves-effect waves-button" href="javascript:;" onclick="submitAction()"><i class="glyphicon glyphicon-ok"></i> 提交提现结果</a></shiro:hasPermission>
        <shiro:hasPermission name="business:billlog:cancel"><a class="waves-effect waves-button" href="javascript:;" onclick="cancelAction()"><i class="glyphicon glyphicon-stop"></i> 撤销申请</a></shiro:hasPermission>
        <a class="waves-effect waves-button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"><i class="zmdi zmdi-search"></i> 高级搜索</a>
    </div>
    <table id="table"></table>
</div>
<jsp:include page="/resources/inc/footer.jsp" flush="true"/>
<jsp:include page="/resources/inc/export.jsp" flush="true"/>

<script>
    var $table = $('#table');
    $(function() {
        // bootstrap table初始化
        $table.bootstrapTable({
            url: '${basePath}/manage/billlog/list',
            height: getNoHeadHeight($('#queryHead').height),
            detailFormatter: 'detailFormatter',
            paginationLoop: false,
            silentSort: false,
            smartDisplay: false,
            escape: true,
            searchOnEnterKey: true,
            maintainSelected: true,
            toolbar: '#toolbar',               //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: true,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber: 1,                      //初始化加载第一页，默认第一页,并记录
            pageSize: 10,                     //每页的记录行数（*）
            pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
            search: false,                      //是否显示表格搜索
            strictSearch: true,
            showColumns: true,                  //是否显示所有的列（选择显示的列）
            showRefresh: true,                  //是否显示刷新按钮
            minimumCountColumns: 2,             //最少允许的列数
            clickToSelect: true,                //是否启用点击选中行
            showToggle: true,                   //是否显示详细视图和列表视图的切换按钮
            cardView: false,                    //是否显示详细视图
            detailView: false,                  //是否显示父子表
            idField: 'id',
            toolbar: '#toolbar',
            queryParams : function(params) {
                return splitFormSerializeValue('searchFrom',params);
            },
            columns: [
                {field: 'ck', checkbox: true},
                {field: 'agentId', title: '所属代理'},
                {field: 'status', title: '状&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;态',formatter:'statusFormatter'},
                {field: 'createTime', title: '创&nbsp;&nbsp;建&nbsp;&nbsp;时&nbsp;&nbsp;间',formatter:'detailLongDateTimeFormatter'},
                {field: 'updateTime', title: '更&nbsp;&nbsp;新&nbsp;&nbsp;时&nbsp;&nbsp;间',formatter:'detailLongDateTimeFormatter'},
                {field: 'bz', title: '备注'},
                {field: 'certificate', title: '凭证',formatter:'certFormatter',events: 'certEvents', clickToSelect: true},
                {field: 'amountRemainder', title: '未提现金额'},
                {field: 'amount', title: '申请提现金额'},
                {field: 'mode', title: '提现方式',formatter:'modeFormatter'},
                {field: 'bank', title: '开户行'},
                {field: 'bankCardNumber', title: '银行卡号码/支付宝账号/微信账号'},
                {field: 'bankPhone', title: '银行预留电话号码'},
                {field: 'bankUser', title: '开户人姓名/支付宝昵称/微信昵称'},
                {field: 'phone', title: '联系电话号码'}
            ]
            <shiro:hasPermission name="business:billlog:export">
            ,
            //导出excel表格设置
            showExport: phoneOrPc(),              //是否显示导出按钮(此方法是自己写的目的是判断终端是电脑还是手机,电脑则返回true,手机返回falsee,手机不显示按钮)
            exportDataType: "basic",              //basic', 'all', 'selected'.
            exportTypes:['excel','xlsx'],	    //导出类型
            exportOptions:{
                //ignoreColumn: [0,0],            //忽略某一列的索引
                fileName: '提现申请数据导出',              //文件名称设置
                excelstyles: ['background-color', 'color', 'font-size', 'font-weight'],
                //onMsoNumberFormat: DoOnMsoNumberFormat
            }
            //导出excel表格设置
            </shiro:hasPermission>
        });

        window.certEvents = {
            'click .glyphicon': function(e, value, row, index) {
                console.log(row);
            }
        }

        //查询按钮事件
        $('#search_btn').click(function() {
            $('#table').bootstrapTable('refresh', {
                //得到查询的参数
                queryParams : function(params) {
                    return splitFormSerializeValue('queryForm',params);
                },
                url : '${basePath}/manage/billlog/list'
            });
        })
        //重置按钮事件
        $("#reset_btn").click(function(){
            $("#searchFrom").resetForm();
        });
    });

    var submitDialog;
    function submitAction(){
        var rows = $table.bootstrapTable('getSelections');
        if(rows.length==0){
            infoDialog("请选择需要提交的数据。");
            return;
        }
        if(rows[0].status != 2){
            infoDialog("该申请已不可提交，请选择状态为处理中的数据。");
            return;
        }
        submitDialog = openDialog('url:${basePath}/manage/billlog/submit/'+rows[0].id,'提交提现结果');
    }

    function confirmAction(){
        var rows = $table.bootstrapTable('getSelections');
        if(rows.length==0){
            infoDialog("请选择需要处理的申请。");
            return;
        }
        if(rows[0].status != 1){
            infoDialog("该申请已不可确认，请选择状态为申请的数据。");
            return;
        }

        $.ajax({dataType: 'json',
            type: 'get',
            url: '${basePath}/manage/billlog/confirm/' + rows[0].id,
            success: function(result) {
                console.log(result)
                if (result.code != 1) {
                    infoDialog(result.data);
                } else {
                    $table.bootstrapTable('refresh');
                }
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                console.log(textStatus)
                infoDialog(textStatus);
            }
        });
    }

    //撤销申请
    function cancelAction(){
        var rows = $table.bootstrapTable('getSelections');
        if(rows.length==0){
            infoDialog("请选择需要撤销的申请。");
            return;
        }
        if(rows[0].status != 1){
            infoDialog("该申请已不可撤销，请选择状态为申请的数据。");
            return;
        }

        $.confirm({
            type: 'red',
            animationSpeed: 300,
            title: "提示",
            content: "请确认是否撤销申请？",
            buttons: {
                confirm: {
                    text: '是',
                    btnClass: 'waves-effect waves-button',
                    action: function () {
                        $.ajax({dataType: 'json',
                            type: 'get',
                            url: '${basePath}/manage/billlog/cancel/' + rows[0].id,
                            success: function(result) {
                                if (result.code != 1) {
                                    infoDialog(result.data);
                                } else {
                                    $table.bootstrapTable('refresh');
                                }
                            },
                            error: function(XMLHttpRequest, textStatus, errorThrown) {
                                infoDialog(textStatus);
                            }
                        });
                    }
                }
            }
        });
    }

    function statusFormatter(value){
        if(value === 1){
            return "<p style='background-color:blue;color: white;padding: 5px;text-align: center;border-radius: 5px;'>" +
                    "申请</p>";
        } else if(value === 2) {
            return "<p style='background-color:darkgreen;color: white;padding: 5px;text-align: center;border-radius: 5px;'>" +
                    "处理中</p>";
        } else if(value === 3) {
            return "<p style='background-color:green;color: white;padding: 5px;text-align: center;border-radius: 5px;'>" +
                    "已完成</p>";
        }  else if(value === 4) {
            return "<p style='background-color:red;color: white;padding: 5px;text-align: center;border-radius: 5px;'>" +
                    "失败</p>";
        } else if(value === 5) {
            return "<p style='background-color:sandybrown;color: white;padding: 5px;text-align: center;border-radius: 5px;'>" +
                    "撤销</p>";
        }
    }

    function modeFormatter(value){
        if(value === 1){
            return '银行卡';
        }
        if(value === 2){
            return '支付宝';
        }
        if(value === 3){
            return '微信';
        }
    }

    function certFormatter(value){
        return "<i class='glyphicon glyphicon-picture'></i>"
    }

</script>
</body>
</html>